﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <base href="/netctoss/"/>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>NetCTOSS</title>
        <link type="text/css" rel="stylesheet" media="all" href="styles/global.css" />
        <link type="text/css" rel="stylesheet" media="all" href="styles/global_color.css" />
        <!--<script language="javascript" type="text/javascript">-->
            <!--//保存结果的提示-->
            <!--function showResult() {-->
                <!--showResultDiv(true);-->
                <!--window.setTimeout("showResultDiv(false);", 3000);-->
            <!--}-->
            <!--function showResultDiv(flag) {-->
                <!--var divResult = document.getElementById("save_result_info");-->
                <!--if (flag)-->
                    <!--divResult.style.display = "block";-->
                <!--else-->
                    <!--divResult.style.display = "none";-->
            <!--}-->

            <!--//切换资费类型-->
            <!--function feeTypeChange(type) {-->
                <!--var inputArray = document.getElementById("main").getElementsByTagName("input");-->
                <!--if (type == 1) {-->
                    <!--inputArray[4].readonly = true;-->
                    <!--inputArray[4].value = "";-->
                    <!--inputArray[4].className += " readonly";-->
                    <!--inputArray[5].readonly = false;-->
                    <!--inputArray[5].className = "width100";-->
                    <!--inputArray[6].readonly = true;-->
                    <!--inputArray[6].className += " readonly";-->
                    <!--inputArray[6].value = "";-->
                <!--}-->
                <!--else if (type == 2) {-->
                    <!--inputArray[4].readonly = false;-->
                    <!--inputArray[4].className = "width100";-->
                    <!--inputArray[5].readonly = false;-->
                    <!--inputArray[5].className = "width100";-->
                    <!--inputArray[6].readonly = false;-->
                    <!--inputArray[6].className = "width100";-->
                <!--}-->
                <!--else if (type == 3) {-->
                    <!--inputArray[4].readonly = true;-->
                    <!--inputArray[4].value = "";-->
                    <!--inputArray[4].className += " readonly";-->
                    <!--inputArray[5].readonly = true;-->
                    <!--inputArray[5].value = "";-->
                    <!--inputArray[5].className += " readonly";-->
                    <!--inputArray[6].readonly = false;-->
                    <!--inputArray[6].className = "width100";-->
                <!--}-->
            <!--}-->
        <!--</script>-->
    </head>
    <body>

        <!--主要区域开始-->
        <div id="main">            
            <div id="save_result_info" class="save_fail">保存失败，资费名称重复！</div>
            <form action="" method="" class="main_form">
                <div class="text_info clearfix"><span>资费名称：</span></div>
                <div class="input_info">
                    <input type="text" class="width300" value="" v-model="fee.costName" @keyup="checkCostName(fee.costName)"/>
                    <span class="required">*</span>
                    <div class="validate_msg_short">50长度的字母、数字、汉字和下划线的组合</div>
                </div>
                <div class="text_info clearfix"><span>资费类型：</span></div>
                <div class="input_info fee_type">
                    <input type="radio" name="radFeeType" id="monthly" @click="typeOne"/>
                    <label for="monthly">包月</label>
                    <input type="radio" name="radFeeType" checked="checked" id="package" @click="typeTwo"/>
                    <label for="package">套餐</label>
                    <input type="radio" name="radFeeType" id="timeBased"  @click="typeThree"/>
                    <label for="timeBased">计时</label>
                </div>
                <div class="text_info clearfix"><span>基本时长：</span></div>
                <div class="input_info">
                    <input type="text" value="" class="width100" v-model="fee.costBaseDuration" @keyup="checkDuration(fee.costBaseDuration)"/>
                    <span class="info">小时</span>
                    <span class="required">*</span>
                    <div class="validate_msg_long">1-600之间的整数</div>
                </div>
                <div class="text_info clearfix"><span>基本费用：</span></div>
                <div class="input_info">
                    <input type="text" value="" class="width100"  v-model="fee.costBaseCost" @keyup="checkBaseCost(fee.costBaseCost)"/>
                    <span class="info">元</span>
                    <span class="required">*</span>
                    <div class="validate_msg_long error_msg">0-99999.99之间的数值</div>
                </div>
                <div class="text_info clearfix"><span>单位费用：</span></div>
                <div class="input_info">
                    <input type="text" value="" class="width100"  v-model="fee.costUnitCost" @keyup="checkUnitCost(fee.costUnitCost)"/>
                    <span class="info">元/小时</span>
                    <span class="required">*</span>
                    <div class="validate_msg_long error_msg">0-99999.99之间的数值</div>
                </div>
                <div class="text_info clearfix"><span>资费说明：</span></div>
                <div class="input_info_high">
                    <textarea class="width300 height70" v-model="fee.costDescr" @keyup="checkDescr(fee.costDescr)"></textarea>
                    <span class="required">*</span>
                    <div class="validate_msg_short error_msg">100长度的字母、数字、汉字和下划线的组合</div>
                </div>                    
                <div class="button_info clearfix">
                    <input type="button" value="保存" class="btn_save"  @click="doInsert()" />
                    <input type="button" value="取消" class="btn_save" @click="closeLayer"/>
                </div>
            </form>  
        </div>
    </body>
    <script type="text/javascript" src="js/jquery/jquery.js"></script>
    <script type="text/javascript" src="js/vue/vue.js"></script>
    <script type="text/javascript" src="js/vue/axios.js"></script>
    <script type="text/javascript" src="js/layer/layer.js"></script>
    <script type="text/javascript" src="js/fee/insert.js"></script>
    <!--<script type="text/javascript" >-->
        <!--$("#monthly").on("click",function () {-->
            <!--$("#type").val(1)-->
        <!--});-->
        <!--$("#package").on("click",function () {-->
            <!--$("#type").val(2)-->
        <!--});-->
        <!--$("#timeBased").on("click",function () {-->
            <!--$("#type").val(3)-->
        <!--})-->
    <!--</script>-->
</html>
